<template>
  <div>
    <el-table
      id="IMTable"
      :data="tableData"
      border
      style="width: 100%"
      :default-sort="{prop: 'id', order: 'ascending'}"
      v-loading="loading"
    >
      <el-table-column show-overflow-tooltip prop="id" label="ID" width="60" align="center" sortable>
		  <template slot-scope="scope">{{(scope.$index+1)+(currentPage-1)*tableSize}}</template>
	  </el-table-column>
      <el-table-column show-overflow-tooltip prop="name" label="姓名"  width="150" align="center"></el-table-column>
      <el-table-column show-overflow-tooltip prop="phone" label="手机号码" align="center"></el-table-column>
      <el-table-column show-overflow-tooltip prop="email" label="邮箱" align="center"></el-table-column>
      <el-table-column show-overflow-tooltip prop="work_limit" label="从业年限" align="center"></el-table-column>
      <el-table-column show-overflow-tooltip prop="territory" label="擅长领域" align="center"></el-table-column>
      <el-table-column show-overflow-tooltip prop="mon_num" label="预估月处理单数" align="center"></el-table-column>
      <el-table-column show-overflow-tooltip prop="status" label="审核状态" align="center"></el-table-column>
      <el-table-column show-overflow-tooltip prop="created_at" label="注册时间" width="180" align="center"></el-table-column>
      <el-table-column label="操作" width="150" fixed="right" align="center">
        <template slot-scope="scope">
          <el-button v-no-more-click:3000 type="primary" size="small" @click="goInfo(scope.row)">查看</el-button>
          <el-button v-no-more-click:3000 type="danger" size="small">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- 查看弹出框 -->
    <myDialog ref="myDialog"></myDialog>
  </div>
</template>

<script>
import { getAgentList } from "~/api/user";
import myDialog from "./detailPage/registrationDetail";

export default {
  head: {
    title: "代理人预注册"
  },
  name:'users',
  data() {
    return {
      currentPage: 1,
      tableSize: 20,
      loading: false,
      tableData: []
    };
  },
  components: {
    myDialog
  },
  async asyncData({ $axios }) {
    return getAgentList($axios)
      .then(res => {
        return { tableData: res.data.data };
      })
      .catch(err => {
        console.log(err);
      });
  },
  created () {
  },
  methods: {
    //查看详情
    goInfo() {
      this.$refs.myDialog.showDialog();
    }
  }
};
</script>

<style>
* {
  margin: 0;
  padding: 0;
}
</style>
